<%@ page import="org.springframework.context.ApplicationContext" %>
<%@ page import="org.springframework.context.support.ClassPathXmlApplicationContext" %>
<%@ page import="com.xyc.mapper.PersonalMapper" %>
<%@ page import="com.xyc.pojo.Personal" %>
<%@ page import="java.util.List" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html>
<html>
    <head lang = "en">
        <meta charset = "UTF-8">
        <meta name = "viewport">
        <title>个人中心</title>
    	<link rel='stylesheet' href='http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css'>
        <script src="http://cdn.bootcss.com/jquery/1.11.0/jquery.min.js" type="text/javascript"></script>
        <script src = "js/jquery.min.js"></script>
        <script src='http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js'></script>
        
        <style>
            img{
                cursor: pointer;
            }
            
            .dialog{    width: 480px;
                height: 230px;
                border: solid 1px #fff;
                border-radius: 5px;
                position: absolute;
                left: 27%;
                bottom: 28%;
                background: #97FFFF;
                line-height: 40px;
                text-align: center;
                display: none;
                font-size:16px;
            }
            
            .showScore{
                cursor: pointer;
                color:red;
            }
            
            .changeImg{
                 width:78px;
                 height:78px;   
            }
        </style>
        
    </head>
    <body>
         <h1><a href = "index.jsp" style = "text-decoration:none;">&nbsp;华为商城</a><small>&nbsp;个人中心</small>
         <small style = "color:blue;"><a href = "buycar.jsp">购物车</a></small></h1>
         
         <br><br><br>
         <div class = "container">
             <div class = "row">
<div class = "col-md-1"><img src = "imgs/king.jpg" style = "width:70px;height:70px;"  onmouseover="bigImg2(this)" onmouseout="normalImg2(this)" border="0"/></div>
                  <div class = "col-md-2"><br><p style = "font-size:16px;">昵称&nbsp;HW6172</p></div>
                  <div class = "col-md-2"><span style = "font-weight:bold;color:blue;font-size:17px;">&nbsp;&nbsp;625&nbsp;</span><span class="glyphicon glyphicon-search showScore" title = "&nbsp;&nbsp;可提现￥6.25"></span><p>我的积分</p></div>
                  
                  <div class = "col-md-2"><span style = "font-weight:bold;color:blue;font-size:17px;">&nbsp;&nbsp;150&nbsp;</span><span class="glyphicon glyphicon-flash showScore" title = "&nbsp;&nbsp;支付优惠￥150"></span><p>&nbsp;&nbsp;代金券</p></div>
                   
                  <div class = "col-md-2"><btn class = "btn btn-danger btn-lg btnjs">申请售后</btn></div>
                  <div class = "col-md-2"><button class = "btn btn-success btn-lg btnjs">评论晒单</button></div>
             </div>
             <hr>
             
             <div class = "row text-center center-block" style = "font-size:20px;font-weight:bold">
                  <div class = "col-md-2"><p>商品详情</p></div>
                  <div class = "col-md-2"><p>历史订单</p></div>
                  <div class = "col-md-2"><p>商品</p></div>
                  <div class = "col-md-2"><p>数量</p></div>
                  <div class = "col-md-2"><p>价格</p></div>
                  <div class = "col-md-2"><p>状态</p></div>
             </div>

             <%
                 ApplicationContext ctx = new ClassPathXmlApplicationContext("spring-dao.xml");
                 PersonalMapper per = ctx.getBean("personalMapper", PersonalMapper.class);
                 List<Personal> personalList = per.find();
                 for(Personal p : personalList){
             %>
             <div class = "row text-center center-block">
                  <div class = "col-md-2"><img src = "imgs/p40/<%=p.getDetail()%>" onmouseover="bigImg(this)" onmouseout="normalImg(this)" class = "changeImg"/></div>
                  <div class = "col-md-2"><br><p><%=p.getId()%></p></div>
                  <div class = "col-md-2"><br><p><%=p.getItem()%></p></div>
                  <div class = "col-md-2"><br><p><%=p.getCount()%></p></div>
                  <div class = "col-md-2"><br><p><%=p.getPrice()%></p></div>
                  <div class = "col-md-2"><br><p style = "font-size:17px;color:red;font-weight:bold;"><%=p.getStatus()%></p></div>
             </div>

             <%}%>

             <hr>
             <div class="dialog">
                 <table style = "margin-top:10%;margin-left:15%;">
                     <tr>
                         <td>
                             &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                             <img src = "imgs/小人行走图.gif" id = "goImg" style = "width:180px;height:135px;"/>
                         </td>
                         <td>
                             <p>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;功能开发中...</p>
                             <a href="#" type="button" class="btn btn-primary" id = "close">知道了</a>
                         </td>
                     </tr>
                 </table>
            </div>
         </div>
         
         <script>
         
            function bigImg(x){
            	x.style.height="99px";
            	x.style.width="99px";
            }
            
            function normalImg(x){
            	x.style.height="78px";
            	x.style.width="78px";
            }
            
            function bigImg2(x){
            	x.style.height="99px";
            	x.style.width="99px";
            }
            
            function normalImg2(x){
            	x.style.height="70px";
            	x.style.width="70px";
            }
            
            
            $(".btnjs").click(function(){
                $(".dialog").show(200)
            })
            
            
            $("#close").click(function(){
                $(".dialog").hide()
            })
            
            $(".next").click(function(){
            /*  windows.onload('http://xyc.life/comment.html')*/
                window.location.assign('comment.html');
            })
            
            window.onload = function() {
            document.getElementById('dialog').addEventListener('click', function() {
                document.getElementById('goImg').src = document.getElementById('goImg').src
            });
        }
        </script>
    </body>
</html>
    